<!DOCTYPE html>
<html style="max-width: 720px">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
		<title>{:C('WEB_SITE_TITLE')}</title>
		<link rel="stylesheet" href="__PUBLIC__/Home/css/swiper-3.3.1.min.css">
		<script src="__PUBLIC__/Home/js/swiper-3.3.1.min.js"></script>

		<link rel="stylesheet" href="__PUBLIC__/Home/css/common.css">
		<link rel="stylesheet" href="__PUBLIC__/Home/css/main.css">
		<script src="__PUBLIC__/Home/js/jquery-1.8.3.min.js"></script>
		<script src="__PUBLIC__/Home/js/common.js"></script>
		<script src="__PUBLIC__/Home/js/delIOS_huitan.js"></script>
		<include file="Public/weixin"/>
	</head>
	<body style="max-width: 720px;background:#fff" class="box">
		<!--遮罩层-->
		<div id="zhezhao" style="display:none"></div>
		<!--点击左上角会员按钮出现的 侧边栏-->
		<div id="indexleftBar" style="display: none">
			<div class="top">
				<div class="contain maxWidth">
					<p class="img">
						<if condition="$user.image eq ''">
						<span class="touxiang" style="background-image:url(__PUBLIC__/Home/img/mytouxiang.png)"></span>
						<else/>
						<span class="touxiang" style="background-image:url({$user.image})"></span>
						</if>
					</p>
					<p class="nologin"><a href="{:U('Reg/index')}">注册</a><em>|</em><a href="{:U('/Member/Login/index')}">登录</a></p>
					<p class="login" style="display: none">{$user.login_user}</p>
				</div>
			</div>
			<div class="main">
				<div class="contain maxWidth">
					<a href="{:U('/Search/pageindex')}">
						<span class="hz">&#xe607;</span>
						<span>搜索</span>
					</a>
					<a href="{:U('/Member/Order')}" class="active">
						<span class="hz">&#xe610;</span>
						<span>全部订单</span>
					<?php
					if($is_login==1)
					{
					?>
						<if condition="$order_num gt 0"><em class="dingdanNum">{$order_num}</em></if>
					<?php
					}
					?>
					</a>
					<a href="{:U('/Member/UserAddress')}">
						<span class="hz">&#xe60d;</span>
						<span>收货地址</span>
					</a>
					<a href="{:U('/Member/Collection/index')}">
						<span class="hz">&#xe60f;</span>
						<span>我的收藏</span>
					</a>
					<a href="{:U('Cart/index')}">
						<span class="hz">&#xe601;</span>
						<span>我的购物车</span>
					<?php
					if($is_login==1)
					{
					?>
						<if condition="$cart_num gt 0"><em class="cartNum">{$cart_num}</em></if>
					<?php
					}
					?>
					</a>
					<a href="{:U('/Member/Index/couponlist')}">
						<span class="hz">&#xe611;</span>
						<span>我的优惠券</span>
					<?php
					if($is_login==1)
					{
					?>
						<if condition="$coupon_num gt 0"><em class="couponNum">{$coupon_num}</em></if>
					<?php
					}
					?>
					</a>
					<!-- <a href="/Member/Index/infolist">
						<span class="hz">&#xe6a9;</span>
						<span>我的消息</span>
						<?php
					if($is_login==1)
					{
					?>
						<if condition="$info_num gt 0"><em class="xiaoxiNum">{$info_num}</em></if>
					<?php
					}
					?>
					</a> -->
				</div>
			</div>
		</div>
		<!--正文区域-->
		<div id="indexTop">
			<div class="contain maxWidth clear">
				<div class="col-6"><img src="__PUBLIC__/Home/img/logo.png"></div>
				<div class="col-6 search">
					<div class="inputArea">
						<span class="hz search">&#xe6e5;</span>
						<input type="text" id="keywords" placeholder="搜索">
					</div>
				</div>
			</div>
		</div>
		<div id="indexTop1">
			<div class="maxWidth">
				<div class="swiper-container">
					<div class="swiper-wrapper">
						<volist name="all_cates" id="cate">
						<div class="swiper-slide">
							<a href="{:U('Index/catelist',array('id'=>$cate['id']))}">{$cate.title}</a>
						</div>
						</volist>
						<!-- 最后这个不放到循环里面 这个是一定要有的-->
						<div class="swiper-slide">
							<a href="{:U('Search/index')}">所有产品 <span class="hz">&#xe6e6;</span></a>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div id="indexMain" class="fastscroll">
			<div class="maxWidth">
				<!-- 轮播区域-->
				<div class="lunbo lunbotop">
					<div class="swiper-container">
						<div class="swiper-wrapper">
							<volist name="focuslist1" id="item">
								<div class="swiper-slide">
									<a href="{$item.link_url}">
										<img src="{$item.image}"/>
									</a>
								</div>
							</volist>
						</div>
						<div class="swiper-pagination"></div>
					</div>
				</div>
				<!-- 蜜罐儿热销榜-->
				<div class="rexiaoBang">
					<div class="title">蜜罐儿热销榜</div>
					<div class="clear">
						<div class="l ban">
							<p class="tit">当日单品热销榜</p>
							<!-- <span class="img"></span>这个会自动根据li的序号显示相应的图片-->
							<ul>
								<volist name="prolist" id="pro">
								<li>
									<a href="{:U('Product/detail',array('id'=>$pro['id']))}">
										<span class="img"></span>
										<span class="text">{$pro.title}</span>
									</a>
								</li>
								</volist>
							</ul>
						</div>
						<div class="line l">&nbsp;</div>
						<div class="l ban">
							<p class="tit">当月单品热销榜</p>
							<!-- <span class="img"></span>这个会自动根据li的序号显示相应的图片-->
							<ul>
								<volist name="prolist1" id="pros">
								<li>
									<a href="{:U('Product/detail',array('id'=>$pros['id']))}">
										<span class="img"></span>
										<span class="text">{$pros.title}</span>
									</a>
								</li>
								</volist>
							</ul>
						</div>
					</div>
				</div>
				<!-- 拼团秒杀-->
				<div class="pintuanMiaosha">
					<p class="tit"><img src="__PUBLIC__/Home/img/index/ptTit.jpg" /></p>
					<!--
						status1代表距离开始 status2代表距离结束
						liendTimeStr='2016/12/24 16:46:10';
						从后台读取的时间截止的毫秒数 1478350790050 传ms数或者，这种格式的字符串都行
					-->
					<ul class="lie">
						<volist name="spell" id="vo">
						<li data-juStartTime="{:date('Y/m/d H:i:s',$vo['start_date'])}" data-juEndTime="{:date('Y/m/d H:i:s',$vo['end_date'])}" data-status="{$vo.state}">
							<a href="{:U('Spell/detail',array('id'=>$vo['id']))}">
								<img src="{$vo.image}"/>
								<div class="line1">
									<span class="share">{$statearr[$vo['state']]}</span>
									<if condition="$vo['state'] lt 3">
									<span class="daojishi"><span class="daojishiText">距结束</span> <span class="time"><b class="shi">08</b>:<b class="fen">26</b>:<b class="miao">58</b></span></span>
									</if>
								</div>
								<div class="line2">{$vo.title}</div>
								<div class="line3">
									<span class="xian">&yen;<span class="money">{$vo.price}</span></span>
									<del>&yen;<span class="money">{$vo.oldprice}</span></del>
								</div>
								<div class="line4 textR">
								<span class="goKaituan">
									{$vo.num}人团<span class="line"></span>去开团
								</span>
								</div>
							</a>
						</li>
						</volist>
					</ul>
					<div class="more">
						<a href="{:U('Spell/index')}">查看更多 <span class="hz">&#xe60c;</span></a>
					</div>
				</div>
				<!-- com美丽-->
				<div class="com" id="beautiful">
					<div class="tit">
						<a href="__URL__/catelist/id/14"><img src="__PUBLIC__/Home/img/index/index_tit1.jpg" /></a>
					</div>
					<div class="lunbo">
						<div class="swiper-container">
							<div class="swiper-wrapper">
								<volist name="list2" id="l2">
								<div class="swiper-slide">
									<a href="{$l2.link_url}">
										<img src="{$l2.image}"/>
									</a>
								</div>
								</volist>

							</div>
							<div class="swiper-pagination"></div>
						</div>
					</div>
					<ul class="lie clear">
						<volist name="products1" id="pro1">
						<li>
							<a href="{:U('Product/detail',array('id'=>$pro1['id']))}">
								<img src="{$pro1.image}"/>
								<div class="line1">{$pro1.title}</div>
								<div class="line2">
									<span class="xian">&yen;<span class="money">{$pro1.gprice}</span></span>
									<del>&yen;<span class="money">{$pro1.market_price}</span></del>
								</div>
							</a>
						</li>
						</volist>
					</ul>
				</div>
				<!-- com健康-->
				<div class="com" id="health">
					<div class="tit">
						<a href="__URL__/catelist/id/16"><img src="__PUBLIC__/Home/img/index/index_tit2.jpg" /></a>
					</div>
					<div class="lunbo">
						<div class="swiper-container">
							<div class="swiper-wrapper">
								<volist name="list3" id="l3">
								<div class="swiper-slide">
									<a href="{$l3.link_url}">
										<img src="{$l3.image}"/>
									</a>
								</div>
								</volist>
							</div>
							<div class="swiper-pagination"></div>
						</div>
					</div>
					<ul class="lie clear">
						<volist name="products2" id="pro2">
						<li>
							<a href="{:U('Product/detail',array('id'=>$pro2['id']))}">
								<img src="{$pro2.image}"/>
								<div class="line1">{$pro2.title}</div>
								<div class="line2">
									<span class="xian">&yen;<span class="money">{$pro2.gprice}</span></span>
									<del>&yen;<span class="money">{$pro2.market_price}</span></del>
								</div>
							</a>
						</li>
						</volist>

					</ul>
				</div>
				<!-- com玩乐-->
				<div class="com" id="wanle">
					<div class="tit">
						<a href="__URL__/catelist/id/17"><img src="__PUBLIC__/Home/img/index/index_tit3.jpg" /></a>
					</div>
					<div class="lunbo">
						<div class="swiper-container">
							<div class="swiper-wrapper">
								<volist name="list4" id="l4">
								<div class="swiper-slide">
									<a href="{$l4.link_url}">
										<img src="{$l4.image}"/>
									</a>
								</div>
								</volist>
							</div>
							<div class="swiper-pagination"></div>
						</div>
					</div>
					<ul class="lie clear">
						<volist name="products4" id="pro4">
						<li>
							<a href="{:U('Product/detail',array('id'=>$pro4['id']))}">
								<img src="{$pro4.image}"/>
								<div class="line1">{$pro4.title}</div>
								<div class="line2">
									<span class="xian">&yen;<span class="money">{$pro4.gprice}</span></span>
									<del>&yen;<span class="money">{$pro4.market_price}</span></del>
								</div>
							</a>
						</li>
						</volist>
					</ul>
				</div>
				<!-- com家居-->
				<!-- <div class="com" id="jiaju">
					<div class="tit">
						<a href="__URL__/catelist/id/5"><img src="__PUBLIC__/Home/img/index/index_tit4.jpg" /></a>
					</div>
					<div class="lunbo">
						<div class="swiper-container">
							<div class="swiper-wrapper">
								<volist name="list5" id="l5">
								<div class="swiper-slide">
									<a href="{$l5.link_url}">
										<img src="{$l5.image}"/>
									</a>
								</div>
								</volist>
							</div>
							<div class="swiper-pagination"></div>
						</div>
					</div>
					<ul class="lie clear">
						<volist name="products4" id="pro4">
						<li>
							<a href="{:U('Product/detail',array('id'=>$pro4['id']))}">
								<img src="{$pro4.image}"/>
								<div class="line1">{$pro4.title}</div>
								<div class="line2">
									<span class="xian">&yen;<span class="money">{$pro4.gprice}</span></span>
									<del>&yen;<span class="money">{$pro4.market_price}</span></del>
								</div>
							</a>
						</li>
						</volist>
					</ul>
				</div> -->

			</div>
		</div>
		<include file="Public:footer" />

		<script>
			//点击搜索区域
			$('#indexTop .search .inputArea').on('click',function(){
				location.href="{:U('Search/pageindex')}";
			});

			//顶部轮播 720 400
			//设置图片高度
			setTopLunboH();
			function setTopLunboH(){
				var w=$('#indexMain .lunbotop .swiper-slide a img').width();
				$('#indexMain .lunbotop .swiper-slide a img').height(400*w/720);
			}
			var mySwiper = new Swiper('#indexMain .lunbotop .swiper-container', {
				autoplay: 3000,
				loop:true,
				autoplayDisableOnInteraction:false,
				pagination : '.swiper-pagination'
			});

			//水平滑动 不固定用这个
			var mySwiper1 = new Swiper('#indexTop1 .swiper-container',{
				freeMode : true,
				slidesPerView: 'auto'
			});

			//拼团秒杀 700 400
			setPintuanMiaoshaH();
			function setPintuanMiaoshaH(){
				var w=$('#indexMain .pintuanMiaosha .lie li img').width();
				$('#indexMain .pintuanMiaosha .lie li img').height(400*w/700);
			}
			//拼团 money显示.0
			CashToZero1('#indexMain .pintuanMiaosha .money');

			//com tit img高度720 110
			setcomTitimgH();
			function setcomTitimgH(){
				var w=$('#indexMain .com .tit img').width();
				$('#indexMain .com .tit img').height(110*w/720);
			}
			//轮播
			var mySwiperCom = new Swiper('#indexMain .com .lunbo .swiper-container', {
				autoplay: 3000,
				loop:true,
				autoplayDisableOnInteraction:false,
				pagination : '.swiper-pagination'
			});
			//700 /400
			setComLunboH();
			function setComLunboH(){
				var w=$('#indexMain .com .lunbo .swiper-slide a img').width();
				$('#indexMain .com .lunbo .swiper-slide a img').height(400*w/700);
			}
			//商品图片h 345/300
			setComImgH();
			function setComImgH(){
				var w=$('#indexMain .com .lie li img').width();
				$('#indexMain .com .lie li img').height(300*w/345);
			}
			//money 显示.0
			CashToZero1('#indexMain .com .money');

			//拼团倒计时////////////////////////////////////////////////////////////////////////////////////////////
			//距离结束 距离开始 公共调用的函数
			function setPTtime(li,listatus,listartTimeStr,liendTimeStr,licurrTime,litimer){
				var NowTime = new Date();
				var t =licurrTime.getTime() - NowTime.getTime();
				var d=0;
				var h=0;
				var m=0;
				var s=0;
				if(t>=0){
					d=Math.floor(t/1000/60/60/24);
					h=Math.floor(t/1000/60/60%24);
					m=Math.floor(t/1000/60%60);
					s=Math.floor(t/1000%60);
				}else{
					clearInterval(litimer);
					//距离开始倒计时结束后，直接走距离结束的倒计时
					if(listatus==1){
						listatus=2;
						juliEndTimer(li,listatus,listartTimeStr,liendTimeStr,licurrTime,litimer);
						//ajax 把后台的status设置为2
						$.ajax({
							type: 'GET',
							url: "{:U('Spell/updateSpell')}",
							dataType: 'json',
							success: function(data){

							},
							error: function(xhr, type){
								console.log('Ajax error!');
							}
						});
					}
				}

				//天转换成小时
				h+=d*24;
				$(li).find('.line1 .daojishi .time .shi').text(zhuanTwo(h));
				$(li).find('.line1 .daojishi .time .fen').text(zhuanTwo(m));
				$(li).find('.line1 .daojishi .time .miao').text(zhuanTwo(s));
			}
			function zhuanTwo(v){
				//时分秒转成两位数
				if(v<10){
					return '0'+v;
				}else{
					return ''+v;
				}
			}
			//距离结束
			function juliEndTimer(li,listatus,listartTimeStr,liendTimeStr,licurrTime,litimer){
				var liEndTime= new Date(liendTimeStr);
				licurrTime=liEndTime;
				$(li).find('.daojishiText').text('距离结束');
				litimer=setInterval(function(){
					setPTtime(li,listatus,listartTimeStr,liendTimeStr,licurrTime,litimer);
				},30);
			}
			//距离开始
			function juliStartTimer(li,listatus,listartTimeStr,liendTimeStr,licurrTime,litimer){
				var liStartTime= new Date(listartTimeStr);
				licurrTime=liStartTime;
				$(li).find('.daojishiText').text('距离开始');
				litimer=setInterval(function(){
					setPTtime(li,listatus,listartTimeStr,liendTimeStr,licurrTime,litimer);
				},30);
			}
			//根据status走不同的定时器
			function setliDaojishi(li,listatus,listartTimeStr,liendTimeStr,licurrTime,litimer){
				if(listatus==1){
					juliStartTimer(li,listatus,listartTimeStr,liendTimeStr,licurrTime,litimer);
				}else if(listatus==2){
					juliEndTimer(li,listatus,listartTimeStr,liendTimeStr,licurrTime,litimer);
				}
			}
			//获取所有的li，执行倒计时操作
			var allli=$('#indexMain .pintuanMiaosha .lie li');
			for(var x=0;x<allli.length;x++){
				//设置
				allli[x].timer=null;
				allli[x].currTime=null;

				//获取
				var li=$(allli[x]);
				var listatus=$(allli[x]).attr('data-status');
				var listartTimeStr=$(allli[x]).attr('data-juStartTime');
				var liendTimeStr=$(allli[x]).attr('data-juEndTime');
				var licurrTime=allli[x].currTime;
				var litimer=allli[x].timer;

				//执行倒计时操作
				setliDaojishi(li,listatus,listartTimeStr,liendTimeStr,licurrTime,litimer);
			}
		</script>
	   <script>
		   $(function () {
			   $.ajax({
			       typr:'post',
			       url:"http://192.168.1.153:8082/Clientapi",
				   dataType:"json",
				   success:function (responce) {
//					   console.log(responce)
                   },error:function(xhr,type){
                      console.log('error!');
				   }
			   })
           })
	   </script>
	</body>
</html>
